:root {
  /* 动态表单主题变量 */
  --dynamic-form-bg: #fff;
  --dynamic-form-margin: 20px;

  /* 头部样式变量 */
  --card-header-display: flex;
  --card-header-justify: space-between;
  --card-header-align: center;
  --card-header-padding: 15px 20px;

  /* 标题样式变量 */
  --card-title-weight: bold;
  --card-title-size: 16px;

  /* 展开按钮样式变量 */
  --expand-button-border: 1px solid rgba(169, 197, 224, 0.4);
  --expand-button-padding: 8px 16px;
  --expand-button-radius: 6px;
  --expand-button-transition: all 0.3s ease;
  --expand-button-bg: rgba(240, 248, 255, 0.2);
  --expand-button-backdrop: blur(6px);
  --expand-button-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
  --expand-button-color: #2c3e50;
  --expand-button-font-weight: 500;

  /* 展开按钮悬停样式变量 */
  --expand-button-hover-bg: rgba(240, 248, 255, 0.3);
  --expand-button-hover-border: rgba(169, 197, 224, 0.5);
  --expand-button-hover-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);

  /* 展开按钮激活样式变量 */
  --expand-button-expanded-bg: rgba(240, 248, 255, 0.25);
  --expand-button-expanded-border: rgba(169, 197, 224, 0.45);

  /* 表单操作区域样式变量 */
  --form-actions-align: center;
  --form-actions-padding: 20px;
  --form-actions-box: border-box;

  /* 表单栅格样式变量 */
  --dynamic-form-row-margin-x: -10px !important;
  --dynamic-form-col-padding-x: 10px !important;

  /* 表单项样式变量 */
  --dynamic-form-item-content-display: flex;

  /* 表单组件样式变量 */
  --dynamic-form-component-width: 100%;

  /* 日期选择器样式变量 */
  --date-range-picker-width: 100%;

  /* 日期选择器弹出框样式变量 */
  --date-range-picker-popper-max-width: none !important;
  --date-range-picker-popper-border: 1px solid #e4e4e4;
  --date-range-picker-popper-header-padding: 8px 10px;
  --date-range-picker-popper-header-border: 1px solid #e4e4e4;

  /* 小屏幕适配变量 */
  --date-range-picker-popper-mobile-width: auto;
  --date-range-picker-popper-mobile-min-width: 280px;
  --date-range-picker-content-min-width: 220px;
  --date-range-picker-content-mobile-min-width: 220px;
}

/* 暗色主题变量 */
[data-theme="dark"] {
  /* 动态表单主题变量 */
  --dynamic-form-bg: #2d2d2d;

  /* 展开按钮样式变量 */
  --expand-button-border: 1px solid rgba(100, 149, 237, 0.4);
  --expand-button-bg: rgba(30, 30, 40, 0.3);
  --expand-button-color: #e0e0e0;

  /* 展开按钮悬停样式变量 */
  --expand-button-hover-bg: rgba(30, 30, 40, 0.4);
  --expand-button-hover-border: rgba(100, 149, 237, 0.6);

  /* 展开按钮激活样式变量 */
  --expand-button-expanded-bg: rgba(30, 30, 40, 0.35);
  --expand-button-expanded-border: rgba(100, 149, 237, 0.5);

  /* 日期选择器弹出框样式变量 */
  --date-range-picker-popper-border: 1px solid #555;
  --date-range-picker-popper-header-border: 1px solid #555;
}
